<template>
  <div style="margin: 10px">
    <a-card size="small">

      <a-form-model :model="queryParam" layout="vertical">
        <a-row :gutter="24">
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="第一责任人">
              <a-input v-model="queryParam.firstResponsiblePerson" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="第一责任人手机">
              <a-input v-model="queryParam.firstResponsiblePersonPhone" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="第一责任人邮箱">
              <a-input v-model="queryParam.firstResponsiblePersonEmail" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="直接责任人">
              <a-input v-model="queryParam.directResponsiblePerson" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="直接责任人手机">
              <a-input v-model="queryParam.directResponsiblePersonPhone" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="直接责任人邮箱">
              <a-input v-model="queryParam.directResponsiblePersonEmail" placeholder="" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="镇（街道）管理机构名称">
              <a-input v-model="queryParam.unitName" placeholder="" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="镇（街道）管理机构负责人">
              <a-input v-model="queryParam.unitHead" placeholder="" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="镇（街道）管理机构负责人手机号">
              <a-input v-model="queryParam.unitHeadPhone" placeholder="" />
            </a-form-model-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-model-item label="镇（街道）管理机构负责人邮箱">
              <a-input v-model="queryParam.unitHeadEmail" placeholder="" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row :gutter="24">
          <a-col :lg="24" :md="24" :sm="24">
            <a-form-model-item :style="{ float: 'right' }">
              <!-- <a-button v-if="displayf != 'choose'" style="margin-left: 14px;" @click="importExcel(queryParam)">导入</a-button> -->
              <!-- <a-button v-if="area == 'basic'" style="margin-left: 14px;" @click="exportExcel(queryParam)">导出工程清单</a-button> -->
              <a-button type="primary" style="margin-left: 14px;" @click="onSave()">更新</a-button>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-card>
  </div>
</template>
<script>
import { tranDate } from '@/utils/util'
import { GetTownDetail, SaveTown } from '@/api/statistics'

export default {
  data() {
    return {
      spinning: false,
      queryParam: {
        id: '',
        departmentID: '',
        firstResponsiblePerson: '',
        firstResponsiblePersonPhone: '',
        firstResponsiblePersonEmail: '',
        directResponsiblePerson: '',
        directResponsiblePersonPhone: '',
        directResponsiblePersonEmail: '',
        unitName: '',
        unitHead: '',
        unitHeadPhone: '',
        unitHeadEmail: '',
        updateUserID: '',
        updateTime: ''
      },
      formItemLayout: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 10 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 14 }
        }
      },
      tranDate: tranDate
    }
  },
  created() {
    const { initData } = this
    initData()
  },
  methods: {
    initData(data) {
      this.spinning = true
      GetTownDetail(data)
        .then(res => {
          if (res.data) {
            this.queryParam = res.data
          }
          this.queryParam.updateTime = tranDate(this.queryParam.updateTime)
        })
        .finally(() => {
          this.spinning = false
        })
    },
    onSave() {
      SaveTown(this.queryParam).then(() => {
        this.$message.success('保存成功!')
        this.initData()
      })
    }
  }
}
</script>
<style>

</style>
